document.addEventListener('DOMContentLoaded', function() {
    // 导航栏滚动效果
    window.addEventListener('scroll', function() {
        const header = document.querySelector('header');
        if (window.scrollY > 50) {
            header.classList.add('scrolled');
        } else {
            header.classList.remove('scrolled');
        }
    });

    // 博客搜索功能
    const searchInput = document.getElementById('searchInput');
    if (searchInput) {
        searchInput.addEventListener('input', filterBlogPosts);
    }

    // 博客分类过滤功能
    const categoryFilter = document.getElementById('categoryFilter');
    if (categoryFilter) {
        categoryFilter.addEventListener('change', filterBlogPosts);
    }

    // 评论表单提交
    const commentForm = document.getElementById('commentForm');
    if (commentForm) {
        commentForm.addEventListener('submit', function(e) {
            e.preventDefault();
            submitComment();
        });
    }

    // 联系表单提交
    const contactForm = document.getElementById('contactForm');
    if (contactForm) {
        contactForm.addEventListener('submit', function(e) {
            e.preventDefault();
            submitContactForm();
        });
    }
});

// 博客文章过滤函数
function filterBlogPosts() {
    const searchInput = document.getElementById('searchInput');
    const categoryFilter = document.getElementById('categoryFilter');
    const blogItems = document.querySelectorAll('.blog-item');
    
    if (!searchInput || !categoryFilter || !blogItems.length) return;

    const searchTerm = searchInput.value.toLowerCase();
    const selectedCategory = categoryFilter.value.toLowerCase();

    blogItems.forEach(function(item) {
        const title = item.querySelector('h3 a').textContent.toLowerCase();
        const excerpt = item.querySelector('.post-excerpt').textContent.toLowerCase();
        const category = item.querySelector('.post-category').textContent.toLowerCase();
        
        const matchesSearch = title.includes(searchTerm) || excerpt.includes(searchTerm);
        const matchesCategory = selectedCategory === '' || category.includes(selectedCategory);
        
        if (matchesSearch && matchesCategory) {
            item.style.display = 'flex';
        } else {
            item.style.display = 'none';
        }
    });
}

// 评论提交函数
function submitComment() {
    const name = document.getElementById('commentName').value;
    const email = document.getElementById('commentEmail').value;
    const content = document.getElementById('commentContent').value;
    
    if (!name || !email || !content) {
        alert('请填写所有必填字段');
        return;
    }
    
    // 在实际应用中，这里应该发送 AJAX 请求到服务器
    // 这里我们模拟添加评论到页面
    
    const commentsList = document.querySelector('.comments-list');
    if (commentsList) {
        const newComment = document.createElement('div');
        newComment.className = 'comment';
        
        const now = new Date();
        const dateString = `${now.getFullYear()}年${now.getMonth() + 1}月${now.getDate()}日`;
        
        newComment.innerHTML = `
            <div class="comment-avatar">
                <img src="images/avatar.jpg" alt="评论者头像">
            </div>
            <div class="comment-content">
                <div class="comment-info">
                    <span class="comment-author">${name}</span>
                    <span class="comment-date">${dateString}</span>
                </div>
                <p>${content}</p>
                <a href="#" class="comment-reply">回复</a>
            </div>
        `;
        
        commentsList.insertBefore(newComment, commentsList.firstChild);
        
        // 清空表单
        document.getElementById('commentName').value = '';
        document.getElementById('commentEmail').value = '';
        document.getElementById('commentContent').value = '';
        
        alert('评论已成功提交！');
    }
}

// 联系表单提交函数
function submitContactForm() {
    const name = document.getElementById('name').value;
    const email = document.getElementById('email').value;
    const subject = document.getElementById('subject').value;
    const message = document.getElementById('message').value;
    
    if (!name || !email || !subject || !message) {
        alert('请填写所有必填字段');
        return;
    }
    
    // 在实际应用中，这里应该发送 AJAX 请求到服务器
    // 这里我们只是模拟提交成功
    
    // 清空表单
    document.getElementById('name').value = '';
    document.getElementById('email').value = '';
    document.getElementById('subject').value = '';
    document.getElementById('message').value = '';
    
    alert('您的留言已成功提交！我们会尽快回复您。');
}

// 添加图片占位符
document.addEventListener('DOMContentLoaded', function() {
    // 为了演示目的，添加占位图片
    const placeholderImages = document.querySelectorAll('img[src="images/placeholder.jpg"]');
    placeholderImages.forEach(function(img) {
        img.src = 'https://via.placeholder.com/800x400/4a6da7/ffffff?text=博客图片';
    });
    
    const avatarImages = document.querySelectorAll('img[src="images/avatar.jpg"]');
    avatarImages.forEach(function(img) {
        img.src = 'https://via.placeholder.com/60x60/4a6da7/ffffff?text=头像';
    });
    
    const profileImage = document.querySelector('img[src="images/profile.jpg"]');
    if (profileImage) {
        profileImage.src = 'https://via.placeholder.com/300x300/4a6da7/ffffff?text=个人照片';
    }
}); 